<!DOCTYPE html>
<%@ include file="includes/head.jsp"%>

<h1>
	<%
		//format
	
		//Tambien se puede con el pageContext
		Properties propertiesMsg = (Properties) getServletContext()
				.getAttribute("propertiesMsg");
		out.print(MessageFormat.format(propertiesMsg.getProperty("login.success"),session.getAttribute("username")));
	%>
</h1>

<h2>
	<%
		out.print(Utilidades.getActualDate());
	%>
</h2>
<%
	out.print("Este es el " + Utilidades.mensaje("tituloIndice"));
%>

<!-- TAG NAV aporta un valor semantico para el contenido interno  en este caso de navegacion -->
<nav>
	<ol>
		<!--  Ordered list -->
		<li><a href="ServletSubirFichero">Ejemplo de subir un fichero</a></li>
		<li><a href="request-info">Ejemplo de RequestInfo con post</a></li>
		<li><a href="session-info">Ejemplo de parametros de session
				clase SessionInfo</a></li>



		<li><a href="ServletRanking">Ranking de Alumnos</a></li>
		<li><a href="javaScript.jsp">Ejemplos javascript</a></li>
		<li><a href="jquery.jsp">Ejemplo jquery</a></li>
		<li><a href="formularioAcuseRecibo.jsp">Formulario Acuse
				Recibo</a></li>


	</ol>

</nav>
<span> <%
 	if (session.getAttribute("saludo") != null) {
 		out.println("Hola " + session.getAttribute("saludo").toString());
 	}
 %>
</span>

<br />

<hr />
<br />

<!-- Formulario para realizar peticion POST al Request de Info -->
<h2>Formulario de envio mediante metodo post.</h2>
<form action="request-info" method="post">
	Nombre <input type="text" placeholder="Escribe tu nombre" name="nombre" /><br />
	Apellido <input type="text" placeholder="Escribe tu apellido"
		name="apellido" /><br /> <input type="submit" value="enviar" />

</form>




<br />

<hr />
<br />
<h2>Formulario de envio mediante metodo get.</h2>
<!-- Formulario para realizar peticion GET al Request de Info -->
<form action="request-info" method="get">
	Nombre <input type="text" placeholder="Escribe tu nombre" name="nombre" /><br />
	Apellido <input type="text" placeholder="Escribe tu apellido"
		name="apellido" /><br /> <input type="submit" value="enviar" />

</form>




<br />

<hr />
<br />
<h2>Ejemplo de parrafo</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec
	mattis lorem libero, eget pretium orci vulputate eu. Donec a diam a
	sapien pulvinar ullamcorper ac vel lectus. Vestibulum pretium neque nec
	magna mattis scelerisque. Vestibulum a dapibus augue, ac vulputate
	nisl. Nulla facilisi. Pellentesque tempus, arcu ut tempor bibendum,
	purus ante dapibus neque, sit amet pretium metus eros vel neque. Donec
	sed velit ultrices, blandit eros eget, blandit odio. Aliquam cursus
	nibh ut mi pellentesque elementum sit amet nec ipsum. Nunc non
	tristique urna. In in quam sit amet velit varius egestas et et neque.
	Sed facilisis hendrerit nulla. Curabitur ut pretium risus, eu dictum
	diam. Sed ut velit ipsum. Duis lobortis nisi quis turpis interdum
	faucibus. Cras tristique eu arcu sit amet scelerisque. Cras eleifend
	blandit nisi vel pharetra. Phasellus nibh tortor, congue in rutrum
	quis, sollicitudin eu velit. Praesent mollis diam ut dui accumsan, quis
	vehicula tellus consequat. In gravida interdum augue id pretium.
	Aliquam ut augue nisi. Praesent eget nisl ut ligula venenatis
	condimentum eget nec enim. Maecenas a bibendum velit. Donec pretium
	luctus imperdiet. Ut imperdiet lorem enim, congue posuere lectus
	venenatis non. Sed tempor facilisis porta. Maecenas sagittis at augue
	eget tristique. Nulla condimentum ultricies lorem et eleifend. Donec et
	magna non sapien vestibulum tincidunt. Quisque id mauris ut justo
	semper aliquam non vel mi. Nam ultrices rhoncus lectus nec eleifend.
	Phasellus urna odio, suscipit id justo vitae, porttitor dignissim urna.
	Aliquam nec sagittis tellus, a consequat urna. Ut auctor risus mauris,
	eu tristique felis ullamcorper nec. Aliquam id gravida dui. Duis
	ullamcorper, massa quis bibendum convallis, tortor erat tempus magna, a
	euismod justo erat id velit. Nulla vehicula pharetra enim, dignissim
	varius ligula viverra at. Vivamus vitae diam quis velit vulputate
	accumsan. Proin suscipit, erat nec rutrum placerat, turpis purus
	pulvinar est, quis vehicula justo est eget arcu. Fusce consequat vitae
	justo eget faucibus. Phasellus dapibus nibh eget ligula condimentum, at
	consequat tortor rhoncus. Ut commodo sapien et interdum semper. Ut nunc
	erat, iaculis ut congue quis, ullamcorper in diam. Vestibulum viverra
	velit nibh, semper scelerisque tortor viverra eget. Donec accumsan nisl
	sed bibendum sagittis. Phasellus scelerisque nunc metus, vel facilisis
	justo molestie vitae. Maecenas eu tincidunt sapien, ac molestie ipsum.
	Phasellus nec hendrerit turpis. Sed euismod dignissim justo, sed
	sollicitudin tortor interdum a. In eu ligula risus. Suspendisse
	potenti. Curabitur vestibulum augue nulla, vel lobortis velit porta eu.
	Vivamus condimentum turpis quam, ac hendrerit orci consectetur vel.
	Proin vitae sollicitudin enim, ac vestibulum sem. Aliquam vestibulum
	condimentum congue. Donec sollicitudin massa diam, vitae tempus urna
	ornare sed. Nulla sit amet vehicula felis. Etiam dapibus elit nec
	libero feugiat, et tincidunt dui placerat. Nam eu diam non turpis
	eleifend aliquet ac vel tellus. Maecenas eget leo sed neque vehicula
	sodales vel non nulla. Vestibulum ante ipsum primis in faucibus orci
	luctus et ultrices posuere cubilia Curae; Nam hendrerit dolor quis arcu
	varius, nec pulvinar arcu blandit. Fusce eget placerat diam. Aenean nec
	felis vitae massa aliquet auctor sit amet eu purus. Phasellus eleifend
	nulla pulvinar tortor ultrices, non aliquet diam volutpat. Sed vel
	venenatis odio. Integer nec porttitor nunc. Morbi tincidunt, libero sit
	amet ullamcorper ultrices, nisi dui lacinia diam, non ultricies arcu
	est at tortor.</p>
<br />
<hr />
<br />
<h1>Primera pagina web</h1>


<%
	for (int i = 1; i < 7; i++) {
		out.print("<h" + i + ">Cabecera " + i + "</h" + i + ">");
	}
%>
<!--  A partir de HTML5 el type type="text/javascript" sobra -->
<script>
	$(document).ready(function() {

		//aplicar libreria para tablas
		$("#tabla").dataTable();

		//Cambiar css dinamicamente
		$("p").css("border", "3px dotted #000000");
		//Selecciona todos los parrafos
		$("p").click(function() {
			$(this).hide();
		});
	});

	/*function init() {
		
	}
	//Esperamos a cargar toda la pagina para llamar a la funcion de init
	window.onload = init();
	 */
</script>

<table id="tabla" border="1">
	<thead>
		<tr>
			<th>Month</th>
			<th>Savings</th>
		</tr>
	</thead>
	<tfoot>
		<tr>
			<td colspan="2">Pie de pagina</td>
		</tr>
	</tfoot>
	<tbody>

		<%
			for (int i = 0; i < 500; i++) {

				out.println("<tr><td>January</td><td>$100</td></tr>");
			}
		%>

	</tbody>
</table>
<%@ include file="includes/footer.jsp"%>
